<template>
	<view class="navItem">
		<navigator :url="'/packageA/pages/scenic/scenic?id='+item.scenicId">
			<view class="navItem_img">
				<image :src="item.scenicIcon" mode="scaleToFill"></image>
			</view>
			<view class="navItem_msg">
				{{item.scenicName}}
			</view>
		</navigator>
	</view>
</template>

<script>
	export default{
		props:{
			item:{
				type:Object
			}
		},
		mounted() {
			console.log(this.item)
		}
	}
</script>

<style lang="less">
	.navItem{
		height: 6rem;
		width: 23vw;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #fff;
		navigator{
			width: 80%;
			height: 100%;
			text-align: center;
			image{
				width: 4rem;
				height: 4rem;
				display: block;
				margin: .2rem auto;
				border-radius: 50%;
			}
		}
	}
</style>